<template>
  <view class="videwo_tab">
    <view class="title_name">
      <view class="control_box">
        <uni-segmented-control
          :current="current"
          :values="items.map(v=>v.title)"
          @clickItem="onClickItem"
          styleType="text"
          activeColor="#d4237a"
        ></uni-segmented-control>
      </view>
      <text class="iconfont iconsearch"></text>
    </view>
    <view class="title_conent">
      <view class="content">
        <view v-if="current < 4"> <videoFour :urlAll='{url:items[current].url,parmas:items[current].parmas}'></videoFour> </view>
        <view v-if="current === 4"> <videoFen></videoFen> </view>
      </view>
    </view>
  </view>
</template>

<script>
import { uniSegmentedControl } from "@dcloudio/uni-ui";
import videoFour from './video-four/video-four'
import videoFen from './video-fen/video-fen'
export default {
  components: { uniSegmentedControl ,videoFour,videoFen},
  data() {
    return {
      items: [
        {
          title: "推荐",
          url: "http://157.122.54.189:9088/videoimg/v1/videowp/featured",
          parmas: {
            limit: 30,
            skip: 0,
            order: "hot",
          },
        },
        {
          title: "娱乐",
          url:
            "http://157.122.54.189:9088/videoimg/v1/videowp/category/59b25abbe7bce76bc834198a",
          parmas: {
            limit: 30,
            skip: 0,
            order: "new",
          },
        },
        {
          title: "最新",
          url: "http://157.122.54.189:9088/videoimg/v1/videowp/videowp",
          parmas: {
            limit: 30,
            skip: 0,
            order: "new",
          },
        },
        {
          title: "热门",
          url: "http://157.122.54.189:9088/videoimg/v1/videowp/videowp",
          parmas: {
            limit: 30,
            skip: 0,
            order: "hot",
          },
        },
        {
          title: "分类",
          url: "http://157.122.54.189:9088/videoimg/v1/videowp/category",
          parmas: {},
        },
      ],
      current: 0,
    };
  },
  methods: {
    onClickItem(e) {
      if (this.current !== e.currentIndex) {
        this.current = e.currentIndex;
      }
    },
  },
};
</script>

<style lang="scss" scope>
.videwo_tab {
  .title_name {
    position: relative;
    .control_box {
      width: 60%;
      margin: 0 auto;
      padding: 10rpx 0;
    }
    .iconsearch {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      right: 5%;
    }
  }
}
</style>
